import DataBus from '../databus'
import { SCREEN_WIDTH, SCREEN_HEIGHT } from '../render'

export default class GameInfo {
  constructor() {
    this.databus = new DataBus()
    this.returnToMenuCallback = null
    this.gameOverMessage = null
  }

  render(ctx) {
    if (this.databus.gameOver) {
      this.renderGameOver(ctx)
    } else {
      this.renderGameInfo(ctx)
    }
  }

  renderGameInfo(ctx) {
    // 绘制游戏标题
    ctx.fillStyle = '#333'
    ctx.font = 'bold 24px Arial'
    ctx.textAlign = 'center'
    ctx.fillText('五子棋', SCREEN_WIDTH / 2, 155)
    
    // 绘制当前玩家信息
    const centerX = SCREEN_WIDTH / 2
    const centerY = SCREEN_HEIGHT / 2
    
    // 绘制棋盘预览
    const boardSize = 15
    const cellSize = Math.min(SCREEN_WIDTH, SCREEN_HEIGHT) / 18
    const boardHeight = boardSize * cellSize
    const boardStartY = (SCREEN_HEIGHT - boardHeight) / 2 + 80
    
    // 绘制玩家卡片
    this.drawPlayerCard(ctx, SCREEN_WIDTH - 120, boardStartY-110 , '白棋玩家', '#fff', 2)
    this.drawPlayerCard(ctx, 20, boardStartY-110, '黑棋玩家', '#000', 1)
    
    // 绘制当前回合提示
    const currentPlayer = this.databus.currentPlayer === 1 ? '黑棋' : '白棋'
    ctx.fillStyle = this.databus.currentPlayer === 1 ? '#000' : '#666'
    ctx.font = 'bold 18px Arial'
    ctx.fillText(`当前回合: ${currentPlayer}`, centerX, SCREEN_HEIGHT - 600)
    
    // 绘制游戏说明
    ctx.fillStyle = 'rgba(255, 255, 255, 0.5)'
    ctx.font = '14px Arial'
    ctx.fillText('点击棋盘落子，落子前需要确认', centerX, SCREEN_HEIGHT - 70)

    // 版本信息
    ctx.font = '14px Arial'
    ctx.fillStyle = 'rgba(255, 255, 255, 0.5)'
    ctx.fillText('v1.4.4 经典五子棋', SCREEN_WIDTH / 2, SCREEN_HEIGHT - 40)
  }

  renderGameOver(ctx) {
    // 绘制半透明背景
    ctx.fillStyle = 'rgba(0, 0, 0, 0.7)'
    ctx.fillRect(0, 0, SCREEN_WIDTH, SCREEN_HEIGHT)
    
    // 绘制游戏结束对话框
    const dialogWidth = 400
    const dialogHeight = 300
    const dialogX = (SCREEN_WIDTH - dialogWidth) / 2
    const dialogY = (SCREEN_HEIGHT - dialogHeight) / 2  // 整体往上移动50像素
    
    // 对话框背景
    ctx.fillStyle = '#fff'
    ctx.fillRect(dialogX, dialogY, dialogWidth, dialogHeight)
    
    // 对话框边框
    ctx.strokeStyle = '#ccc'
    ctx.lineWidth = 3
    ctx.strokeRect(dialogX, dialogY, dialogWidth, dialogHeight)
    
    // 游戏结束标题
    ctx.fillStyle = '#333'
    ctx.font = 'bold 28px Arial'
    ctx.textAlign = 'center'
    ctx.fillText('游戏结束', dialogX + dialogWidth / 2, dialogY + 60)
    
    // 获胜者信息
    let winnerText = ''
    if (this.databus.winner === 0) {
      winnerText = '平局'
    } else {
      winnerText = this.databus.winner === 1 ? '黑棋' : '白棋'
    }
    ctx.font = '20px Arial'
    ctx.fillStyle = '#666'
    ctx.fillText(`获胜者: ${winnerText}`, dialogX + dialogWidth / 2, dialogY + 100)
    
    // 如果有自定义消息，显示它
    if (this.gameOverMessage) {
      ctx.font = '16px Arial'
      ctx.fillStyle = '#FF5722'
      ctx.fillText(this.gameOverMessage, dialogX + dialogWidth / 2, dialogY + 130)
    }
    
    // 绘制返回按钮
    this.drawReturnButton(ctx, dialogX, dialogY, dialogWidth, dialogHeight)
  }

  drawPlayerCard(ctx, x, y, title, color, player) {
    // 卡片背景
    ctx.fillStyle = '#f5f5f5'
    ctx.fillRect(x, y, 100, 60)
    
    // 卡片边框
    ctx.strokeStyle = color
    ctx.lineWidth = 2
    ctx.strokeRect(x, y, 100, 60)
    
    // 标题
    ctx.fillStyle = '#333'
    ctx.font = '12px Arial'
    ctx.textAlign = 'center'
    ctx.fillText(title, x + 50, y + 20)
    
    // 棋子示例
    ctx.fillStyle = color
    ctx.beginPath()
    ctx.arc(x + 50, y + 40, 15, 0, 2 * Math.PI)
    ctx.fill()
    
    // 如果是当前玩家，添加高亮
    if (player === this.databus.currentPlayer) {
      ctx.strokeStyle = '#FFD700'
      ctx.lineWidth = 3
      ctx.strokeRect(x - 2, y - 2, 104, 64)
    }
  }

  drawReturnButton(ctx, dialogX, dialogY, dialogWidth, dialogHeight) {
    const buttonWidth = 120
    const buttonHeight = 40
    const buttonX = dialogX + (dialogWidth - buttonWidth) / 2
    const buttonY = dialogY + dialogHeight - buttonHeight - 30
    
    // 按钮背景
    ctx.fillStyle = '#4CAF50'
    ctx.fillRect(buttonX, buttonY, buttonWidth, buttonHeight)
    
    // 按钮文字
    ctx.fillStyle = '#fff'
    ctx.font = '16px Arial'
    ctx.textAlign = 'center'
    ctx.fillText('返回主菜单', buttonX + buttonWidth / 2, buttonY + 25)
    
    // 保存按钮位置用于点击检测
    this.returnButton = {
      x: buttonX,
      y: buttonY,
      width: buttonWidth,
      height: buttonHeight
    }
  }

  handleTouch(x, y) {
    if (!this.databus.gameOver) return false
    
    // 检查返回按钮点击
    if (this.returnButton && 
        x >= this.returnButton.x && x <= this.returnButton.x + this.returnButton.width &&
        y >= this.returnButton.y && y <= this.returnButton.y + this.returnButton.height) {
      if (this.returnToMenuCallback) {
        this.returnToMenuCallback()
      }
      return true
    }
    
    return false
  }

  setReturnToMenuCallback(callback) {
    this.returnToMenuCallback = callback
  }

  showGameOver(winner, message = null) {
    this.databus.winner = winner
    this.databus.gameOver = true
    this.gameOverMessage = message
  }

  update() {
    // 游戏信息更新逻辑
  }
}
